﻿
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title></title>
    <!-- Bootstrap Styles-->
    <link href="assets/css/bootstrap.css" rel="stylesheet" />
    <!-- FontAwesome Styles-->
    <link href="assets/css/font-awesome.css" rel="stylesheet" />
    <!-- Morris Chart Styles-->

    <!-- Custom Styles-->
    <link href="assets/css/custom-styles.css" rel="stylesheet" />
    <!-- Google Fonts-->
    <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
    <!-- TABLE STYLES-->
    <link href="assets/js/dataTables/dataTables.bootstrap.css" rel="stylesheet" />
</head>
<body>
<div id="wrapper">
    <nav class="navbar navbar-default top-navbar" role="navigation">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="index.html"><i class="fa fa-comments"></i> <strong> 就业岗位可视化</strong></a>
        </div>

    </nav>
    <!--/. NAV TOP  -->
    <nav class="navbar-default navbar-side" role="navigation">
        <div class="sidebar-collapse">
            <ul class="nav" id="main-menu">

                <li>
                    <a href="index.html"><i class="fa fa-dashboard"></i> 岗位—城市</a>
                </li>
<!--                <li>-->
<!--                    <a href="ui-elements.html"><i class="fa fa-desktop"></i> UI Elements</a>-->
<!--                </li>-->
                <li>
                    <a href="chart.html"><i class="fa fa-bar-chart-o"></i> 工作经验—学历</a>
                </li>
                <li>
                    <a href="tab-panel.html"><i class="fa fa-tasks"></i> 公司规模—性质</a>
                </li>

                <li>
                    <a href="table.html" class="active-menu"><i class="fa fa-table"></i> 信息明细</a>
                </li>
<!--                <li>-->
<!--                    <a href="form.html"><i class="fa fa-edit"></i> Forms </a>-->
<!--                </li>-->

                <li>
                    <a href="login.html"><i class="fa fa-sign-out fa-fw"></i> 退出</a>
                </li>
            </ul>

        </div>

    </nav>
    <!-- /. NAV SIDE  -->
    <div id="page-wrapper" >
        <div id="page-inner">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="page-header">
                        信息明细查询 <small>相关岗位信息明细查询TOP100</small>
                    </h1>
                </div>
            </div>
            <!-- /. ROW  -->

            <div class="row">
                <!--                 搜索框-->
                <nav class="navbar navbar-light bg-light">
                    <div class="container-fluid">
                        <a class="navbar-brand">搜索相关岗位</a>
                        <form class="d-flex">
                            <input name = "table"class="form-control me-2" type="search" placeholder="Search" aria-label="Search">

                            <button class="btn btn-outline-success" type="submit">搜索</button>
                        </form>
                    </div>
                </nav>
                <div class="col-md-12">
                    <!-- Advanced Tables -->
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            相关岗位明细查询TOP100
                        </div>
                        <div class="panel-body">

                            <div class="table-responsive">

                                <table class="table table-striped table-bordered table-hover" id="dataTables-example">

                                    <thead>
                                    <tr>
                                        <th>Job_name</th>
                                        <th>Company_name</th>
                                        <th>Workarea</th>
                                        <th>Companytype</th>
                                        <th>Jobwelf</th>
                                        <th>Job_href</th>
                                    </tr>
                                    </thead>
                                    <tbody id="tableecharts1">
                                    </tbody>
                                </table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>
    <!-- /. PAGE INNER  -->
</div>
<!-- /. PAGE WRAPPER  -->
<!-- /. WRAPPER  -->
<!-- JS Scripts-->
<script src="js/jquery.min.js"></script>
<!-- jQuery Js -->
<script src="assets/js/jquery-1.10.2.js"></script>
<!-- Bootstrap Js -->
<script src="assets/js/bootstrap.min.js"></script>
<!-- Metis Menu Js -->
<script src="assets/js/jquery.metisMenu.js"></script>
<!-- DATA TABLE SCRIPTS -->
<script src="assets/js/dataTables/jquery.dataTables.js"></script>
<script src="assets/js/dataTables/dataTables.bootstrap.js"></script>
<script>
    var searchURL = window.location.search;
    searchURL = searchURL.substring(1, searchURL.length);
    var table = searchURL.split("=")[1];
    $(document).ready(function() {
        $('#dataTables-example').DataTable( {
            "ajax": {//ajax请求后台
                "url": "/table/job_list/"+table,
                "type": "POST",
                "dataType" : "json",
                "contentType": "application/json",
            },
            "columns": [
                { "data": "job_name" },
                { "data": "company_name" },
                { "data": "workarea" },
                { "data": "companytype" },
                { "data": "jobwelf" },
                { "data": "job_href" }
            ]
        } );
    } );
</script>

<!-- Custom Js -->
<script src="assets/js/custom-scripts.js"></script>

<script language="JavaScript" src="js/table.js"></script>

</body>
</html>
